<template>
  <div class="content">
    <!-- <div class="breadcrumb" :gutter="24">
            批次信息
        </div> -->
    <div>
      <el-row :gutter="24" style="margin-left:0">
        <el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4" class="workOrder firstworkOrder">
          <div>
            <p>{{ $t("workorder.work_order_number") }}</p>
            <p>{{formData.woId}}</p>
          </div>
        </el-col>
        <el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4" class="workOrder">
          <div>
            <p>{{ $t("workorder.batch_number") }}</p>
            <p>{{formData.lotNum}}</p>
          </div>
        </el-col>
        <el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4" class="workOrder">
          <div>
            <p>{{ $t("recipe.formula_name") }}</p>
            <p>{{formData.recipeName}}</p>
          </div>
        </el-col>
        <el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4" class="workOrder">
          <div>
            <p>{{ $t("recipe.state") }}</p>
            <p :class="(formData.stateCd !== '' && formData.stateCd != null)  ? statusStyle(formData.stateCd) : ''">
              {{queryStatus(formData.stateCd)}}</p>
          </div>
        </el-col>
        <!-- <el-col :xs="4" :sm="4" :md="4" :lg="3" :xl="3" class="workOrder">
                    <div>
                        <p>模式</p>
                        <p style="color:#fff" :class="isRemote == 1 ? 'yuancheng' : isRemote === 0 ? 'jiudi' : ''" v-if="HandShake >=0 && HandShake <= 99">{{isRemote == 1 ? '远程' : isRemote === 0 ? '就地' : ''}}</p>
                        <p v-else style="background:red;color:#fff">断线</p>
                    </div>
                </el-col> -->
        <el-col :xs="24" :sm="24" :md="24" :lg="9" :xl="9">
          <div class="btngroups">
            <el-button type="primary" size="small" @click="handleBatchselect()">{{ $t("run.batch_selection") }}</el-button>
            <el-button :disabled="formData.stateCd == 2 || formData.stateCd == 3 || formData.stateCd == 5 || woIdIsEnable()" type="primary"
              size="small" @click="handleWoidStatus(2)">{{ $t("run.start_up") }}</el-button> <!-- 运行 -->
            <el-button
              :disabled="formData.stateCd == 1 || formData.stateCd == 4 || formData.stateCd == 3 || formData.stateCd == 5 || woIdIsEnable()"
              type="primary" size="small" @click="handleWoidStatus(4)">{{ $t("run.suspend") }}</el-button> <!-- 暂停 -->
            <el-button :disabled="formData.stateCd == 1 || formData.stateCd == 3 || formData.stateCd == 5 || woIdIsEnable()" type="primary"
              size="small" @click="handleWoidStatus(3)">{{ $t("run.end") }}</el-button> <!-- 完成 -->
            <el-button
              :disabled="formData.stateCd == 1 || formData.stateCd == 2 ||  formData.stateCd == 5 || formData.stateCd == 3 || woIdIsEnable()"
              type="primary" size="small" @click="handleWoidStatus(5)">{{ $t("common.abandoned") }}</el-button> <!-- 废弃 -->
          </div>
        </el-col>
      </el-row>
    </div>
    <div class="marginBottom" v-show="screenWidth <= 1300">
      <div class="title">
        步序操作
        <i class="el-icon-caret-bottom zhedie" v-show="stepCollapse" @click="stepCollapse = !stepCollapse"></i>
        <i class="el-icon-caret-top zhedie" v-show="!stepCollapse" @click="stepCollapse = !stepCollapse"></i>
      </div>
      <div v-show="stepCollapse">
        <el-row :gutter="24">
          <el-col :xs="8" :sm="8" :md="5" :lg="4" :xl="4">
            <div style="padding-top:15px">
              <el-form ref="form" :model="forms" label-position="left" label-width="45px">
                <el-form-item label="步序">
                  <el-input v-model="forms.seqNo" disabled placeholder="" clearable></el-input>
                </el-form-item>
              </el-form>
            </div>

          </el-col>
          <el-col :xs="5" :sm="5" :md="5" :lg="5" :xl="5">
            <div class="btnfang" style="padding-top:15px">
              <el-button type="primary" size="small"
                :disabled="phaseIsdis || woIdIsEnable() || parseInt(currJob.isHand) == 1 || currJob.isoperation == 1 || currJob.wo_id != formData.woId || currJob.job_id != currJob.fid"
                @click="sendPlcCommandManualAuto(1)">自 动</el-button>
              <el-button size="small"
                :disabled="phaseIsdis || woIdIsEnable() || parseInt(currJob.isHand) == 0 || currJob.isoperation == 1 || currJob.wo_id != formData.woId || currJob.job_id != currJob.jobDesc"
                @click="sendPlcCommandManualAuto(0)">手 动</el-button>
            </div>
          </el-col>
          <el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="6">
            <div style="padding-top:29px" class="stepCheck">
              <span>步序选择：</span>
              <el-select v-model="stepVal" placeholder="" size="small"
                :disabled="currJob.isHand == 1 || phaseIsdis || woIdIsEnable() || currJob.isoperation == 1 || currJob.wo_id != formData.woId || currJob.job_id != currJob.fid">
                <el-option v-for="item in stepList" :key="item" :label="item" :value="item"></el-option>
              </el-select>
            </div>
          </el-col>
          <el-col :xs="3" :sm="3" :md="3" :lg="3" :xl="5">
            <div class="btnfang" style="padding-top:20px;">
              <el-button type="primary" size="small" @click="handleStepConfirm()"
                :disabled="currJob.isHand == 1 || phaseIsdis || woIdIsEnable() || currJob.isoperation == 1 || currJob.wo_id != formData.woId || currJob.job_id != currJob.fid">确
                认</el-button>
            </div>
          </el-col>
          <!-- <el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
                        <div class="btnfang" style="padding-top:20px;">
                            <el-button type="primary" size="small">{{ $t("run.start_up") }}</el-button>
                            <el-button size="small">暂 停</el-button>
                            <el-button size="small">重 启</el-button>
                            <el-button size="small">退 出</el-button>
                            <el-button size="small">完 成</el-button>
                        </div>

                    </el-col> -->
        </el-row>
      </div>
    </div>
    <div class="marginBottom">
      <div class="title">
        {{$t('run.phase_oper')}}
        <i class="el-icon-caret-bottom zhedie" v-show="phaseCollapse" @click="phaseCollapse = !phaseCollapse"></i>
        <i class="el-icon-caret-top zhedie" v-show="!phaseCollapse" @click="phaseCollapse = !phaseCollapse"></i>
      </div>
      <div v-show="phaseCollapse" style="background:#f2f2f2">
        <el-tabs v-model="activeName" type="border-card">
          <el-tab-pane :label="$t('basic.stage')" name="first1">
            <phase :stepObj="stepObj" :count="count" :unitStat="unitStat" :phaseIsdis="phaseIsdis" :formsSeqNo="formsSeqNo"
              :isoperation="currJob.isoperation" :idObj="idObj" :woId="formData.woId"></phase>
          </el-tab-pane>
          <el-tab-pane :label="$t('basic.material')" name="first">
            <material :stepObj="stepObj" :count="count" :unitStat="unitStat" :woId="formData.woId" :phaseIsdis="phaseIsdis"
              :formsSeqNo="formsSeqNo" :idObj="idObj" :isoperation="currJob.isoperation"></material>
          </el-tab-pane>
          <el-tab-pane :label="$t('recipe.data_entry')" name="second">
            <dataEntry :stepObj="stepObj" :count="count" :unitStat="unitStat" :phaseIsdis="phaseIsdis" :formsSeqNo="formsSeqNo"
              :idObj="idObj" :isoperation="currJob.isoperation" :HandShake="HandShake"></dataEntry>
          </el-tab-pane>
          <el-tab-pane :label="$t('recipe.information_prompt')" name="third">
            <infoEntry :stepObj="stepObj" :statusFun="statusFun" :unitStat="unitStat" :count="count" :woId="formData.woId"
              :phaseIsdis="phaseIsdis" :formsSeqNo="formsSeqNo" :idObj="idObj" :isoperation="currJob.isoperation"
              :stateCd="formData.stateCd" :woidData='woidData'></infoEntry>
          </el-tab-pane>
          <el-tab-pane :label="$t('run.argu_set')" name="fourth">
            <craftConfig :stepObj="stepObj" :count="count" :unitStat="unitStat" :phaseIsdis="phaseIsdis" :formsSeqNo="formsSeqNo"
              :isoperation="currJob.isoperation" :idObj="idObj" :woId="formData.woId">
            </craftConfig>
          </el-tab-pane>
          <el-tab-pane :label="$t('run.argu_query')" name="five">
            <craftInfo :stepObj="stepObj" :count="count" v-if="activeName == 'five'"></craftInfo>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
    <div class="btngroup" v-if="screenWidth <= 1000">
      <p class="jobDescName" :class="getJobNameColor(currJob.statusFun)">{{currJob.jobDesc}}</p>

      <!-- <el-button style="margin-left:0px" type="primary" size="small" @click="handleEquipment()">{{ $t("run.device_selection") }}</el-button> -->
      <div class="operationBtn">
        <el-button style="margin-left:0px" type="primary" size="small"
          @click="handleSelectEquipment(currJob.classId)">{{ $t("run.device_selection") }}</el-button>
        <el-button style="margin-left:0px"
          :disabled="(!(currJob.statusFun === 0 && (currJob.condition === 0 || currJob.condition == 2))) || phaseIsdis || formData.stateCd == 3 || formData.stateCd == 6 || unitStart"
          type="primary" size="small" @click="handleEditPlcStatus(10,'启动')">{{ $t("run.unit_startup") }}</el-button>
        <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitHold" type="primary" size="small"
          @click="handleEditPlcStatus(20,'暂停')">{{ $t("run.unit_pause") }}</el-button>
        <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitRestart" type="primary" size="small"
          @click="handleEditPlcStatus(21,'重启')">{{ $t("run.unit_restart") }}</el-button>
        <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitDone" type="primary" size="small"
          @click="handleEditPlcStatus(40,'结束')">{{ $t("run.unit_end") }}</el-button>
        <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitAbort" type="primary" size="small"
          @click="handleEditPlcStatus(50,'异常退出')">{{ $t("run.unit_abnormal_exit") }}</el-button>
        <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitReset" type="primary" size="small"
          @click="handleEditPlcStatus(60,'重置')">{{ $t("common.reset") }}</el-button>
      </div>

    </div>
    <!-- <div style="margin-bottom:10px">
            <div class="title">工艺参数设定
                <i class="el-icon-caret-bottom zhedie" v-show="taskCollapse" @click="taskCollapse = !taskCollapse"></i>
                <i class="el-icon-caret-top zhedie" v-show="!taskCollapse" @click="taskCollapse = !taskCollapse"></i>
            </div>
            <craftConfig
                v-show="taskCollapse"
                :stepObj="stepObj"
                :count="count"
                :unitStat="unitStat"
                :phaseIsdis="phaseIsdis"
                :formsSeqNo="formsSeqNo"
                :isoperation="currJob.isoperation"
                :idObj="idObj"
                :woId="formData.woId"  >
            </craftConfig>
        </div> -->
    <div>
      <div class="title">
        {{$t('run.batch_job')}}
        <!-- <i class="el-icon-caret-bottom zhedie" v-show="taskCollapse" @click="taskCollapse = !taskCollapse"></i>
                <i class="el-icon-caret-top zhedie" v-show="!taskCollapse" @click="taskCollapse = !taskCollapse"></i> -->
      </div>
      <div class="tableAuto clearfix">
        <el-row :gutter="24" style="margin-right:0">
          <el-col :xs="24" :sm="24" :md="21" :lg="20" :xl="20">
            <el-table :data="tableData" :height="414" v-loading="tableLoading" style="width: 100%" @row-click="rowClick"
              :header-cell-style="{background:'#EAEBEC'}" @expand-change="handledetail" ref="refTable" :row-class-name="tableRowClassName"
              highlight-current-row :row-key='getRowKey'>
              <el-table-column label="" width="50" align="center">
                <template slot-scope="scope">
                  <div>
                    <el-radio :label="scope.row.fid" v-model="radioId">&nbsp;</el-radio>
                  </div>
                </template>
              </el-table-column>
              <el-table-column type="expand">
                <template slot-scope="props">
                  <div style="width:100%;overflow-x:scroll">
                    <el-table :data="props.row.phaseVos" v-loading="childTable" style="width: 100%"
                      :header-cell-style="{background:'#EAEBEC'}" ref="refTable1" border highlight-current-row @row-click="rowClickChild">
                      <el-table-column align="center" :label="$t('basic.stage')" width="100" show-overflow-tooltip
                        prop="phaseDesc"></el-table-column>
                      <el-table-column align="center" label="步序" width="50" show-overflow-tooltip prop="seqNo"></el-table-column>
                      <el-table-column align="center" label="顺序" width="50" show-overflow-tooltip prop="stepSort"></el-table-column>
                      <el-table-column align="left" label="阶段描述" show-overflow-tooltip prop="guideInfo">
                      </el-table-column>
                      <el-table-column :label="$t('run.operation')" width="80" align="center">
                        <template slot-scope="scope">
                          <el-button type="text"
                            :disabled="(stepObj.isActive != 1 || phaseIsdis) || isStep || currJob.isoperation == 1 || isUnitConfirm"
                            size="mini" @click="handleConfirm(scope.row,40)">确 认</el-button>
                        </template>
                      </el-table-column>
                    </el-table>

                    <!-- <table class="table_form" border="0" cellspacing="0" v-loading="childTable">
                                         <thead class="theads">
                                             <tr>
                                                 <th  style="min-width:136px" >阶段</th>
                                                 <th v-for="(item,index) in header" :key="index" :class="[index+1==tdIndex&&tab_index==props.$index ? 'XYaxis': '',getStepColor(props.row.actStep,index),getStepTop(props.row.actStep,index),getHeaderBottom(props.row.actStep,index,props.row.child)]">{{item}}</th>
                                             </tr>
                                         </thead>

                                         <tbody :key="itemKey">
                                             <template v-for="(item,index) in props.row.child">
                                                 <tr :key="index+'l'" v-if="item.display">
                                                     <td :class="{'XYaxis':index==trIndex&&tab_index==props.$index}">{{item.text}}</td>
                                                     <td
                                                         style="position: relative;"
                                                         v-for="(el,indexs) in 32"
                                                         :key="el+'i'"
                                                         @click="handleTD(index,el,props.$index,item.text,item.id,item.unitStat,props.row.fid,props.row.statusFun)"
                                                         :class="[el==tdIndex&&index==trIndex&&tab_index==props.$index?'currTd':'',getStepColor(props.row.actStep,indexs),getStepBottom(index,props.row.actStep,indexs,props.row.child)]"
                                                     >
                                                         <template v-if="item.stepVos">
                                                             <template v-for="(ele,index) in item.stepVos">
                                                                 <span class="getColor"
                                                                     :key="index+'ele'"
                                                                     v-if="ele.seqNo == el-1 && ele.isAuto == 1 && ele.mode == item.id"
                                                                     :class="getColor(props.row.actStep,indexs,ele,item.unitStat,ele.stateCd)">
                                                                     √
                                                                 </span>
                                                             </template>
                                                         </template>
                                                     </td>
                                                 </tr>
                                             </template>
                                             <tr v-if="props.row.child.filter(item => item.display).length == 0">
                                                 <td colspan="33">
                                                     <div style="line-height:40px;color:#999">暂无数据</div>
                                                 </td>
                                             </tr>
                                         </tbody>
                                     </table> -->
                  </div>
                </template>
                <!-- <el-empty description="暂无数据" v-if="phaseVos == 0"></el-empty> -->

              </el-table-column>
              <el-table-column type="index" :label="$t('common.number')" width="60" align="center">
                <template slot-scope="scope">
                  {{table_index(scope.$index+1)}}
                </template>
              </el-table-column>
              <el-table-column :label="$t('recipe.assignment_name')" show-overflow-tooltip prop="jobDesc"></el-table-column>
              <el-table-column :label="$t('recipe.define_equipment')" show-overflow-tooltip prop="equipmentVo">
                <template slot-scope="scope">
                  <span v-if="scope.row.equipmentVo">
                    {{scope.row.equipmentVo.entName}}
                  </span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('basic.equipment_type')" show-overflow-tooltip prop="initSchedEntId">
                <template slot-scope="scope">
                  {{scope.row.equipmentClassVo ? scope.row.equipmentClassVo.className :''}}
                </template>
              </el-table-column>
              <el-table-column :label="$t('run.equip_no')" show-overflow-tooltip prop="equipmentVo">
                <template slot-scope="scope">
                  <span v-if="scope.row.equipmentVo">
                    {{scope.row.equipmentVo.entName}}
                  </span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('run.next_equip_no')" show-overflow-tooltip prop="seqNo"></el-table-column>
              <el-table-column :label="$t('common.auto_start')" show-overflow-tooltip prop="autoStart">
                <template slot-scope="scope">
                  <span>
                    {{scope.row.autoStart == 1 ? '是' : '否'}}
                  </span>
                </template>
              </el-table-column>
              <!-- <el-table-column label="下个设备类型" show-overflow-tooltip prop="nextJob">
                              <template slot-scope="scope">
                                  <span v-if="scope.row.nextEquipmentClassVo">
                                      {{scope.row.nextEquipmentClassVo.className}}
                                  </span>
                              </template>
                          </el-table-column> -->
              <el-table-column :label="$t('run.start_equip')" show-overflow-tooltip prop="desc" width="100">
                <template slot-scope="scope">
                  {{scope.row.firstJob == 1 ? '是' : '否'}}
                </template>
              </el-table-column>
              <el-table-column :label="$t('run.end_equip')" show-overflow-tooltip prop="desc" width="100">
                <template slot-scope="scope">
                  {{scope.row.finalJob == 1 ? '是' : '否'}}
                </template>
              </el-table-column>
              <el-table-column :label="$t('run.model')" show-overflow-tooltip prop="desc" width="100">
                <template slot-scope="scope">
                  {{scope.row.isHand == 1 ? '自动' : scope.row.isHand === 0 ? '手动' : ''}}
                </template>
              </el-table-column>
              <el-table-column :label="$t('recipe.state')" width="80" show-overflow-tooltip prop="statusFun">
                <template slot-scope="scope">
                  {{queryJobstate(scope.row.statusFun)}}
                </template>
              </el-table-column>
            </el-table>
          </el-col>
          <el-col :xs="24" :sm="24" :md="3" :lg="4" :xl="4">
            <div class="btngroup" v-if="screenWidth > 1000">
              <p class="jobDescName" :class="getJobNameColor(currJob.statusFun)">{{currJob.jobDesc}}</p>
              <el-button style="margin-left:0px" type="primary" size="small"
                @click="handleEquipment(currJob)">{{ $t("run.device_selection") }}</el-button>
              <el-button style="margin-left:0px" type="primary" size="small"
                @click="handleEditPlcStatus(10,'启动')">{{ $t("run.unit_startup") }}{{currJob.condition}}</el-button>

              <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitHold" type="primary" size="small"
                @click="handleEditPlcStatus(20,'暂停')">{{ $t("run.unit_pause") }}</el-button>
              <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitRestart" type="primary" size="small"
                @click="handleEditPlcStatus(21,'重启')">{{ $t("run.unit_restart") }}</el-button>
              <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitDone" type="primary" size="small"
                @click="handleEditPlcStatus(40,'结束')">{{ $t("run.unit_end") }}</el-button>
              <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitAbort" type="primary" size="small"
                @click="handleEditPlcStatus(50,'异常退出')">{{ $t("run.unit_abnormal_exit") }}</el-button>
              <el-button style="margin-left:0px" :disabled="phaseIsdis || woIdIsEnable() || unitReset" type="primary" size="small"
                @click="handleEditPlcStatus(60,'重置')">{{ $t("common.reset") }}</el-button>

            </div>
            <div style="margin-top:30px" v-show="screenWidth > 1300">
              <el-form ref="forms" label-position="top" :model="forms" size="small" label-width="85px">
                <el-row :gutter="10">
                  <el-col :xs="20" :sm="20" :md="20" :lg="20" :xl="15">
                    <el-form-item :label="$t('run.step_sequence')">
                      <el-input v-model="forms.seqNo" disabled placeholder="" clearable></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :xs="20" :sm="20" :md="12" :lg="12" :xl="12">
                    <el-form-item :label="$t('run.step_selection')">
                      <el-select v-model="stepVal" placeholder="" size="small"
                        :disabled="currJob.isHand == 1 || phaseIsdis || woIdIsEnable() || currJob.isoperation == 1 || currJob.wo_id != formData.woId || currJob.job_id != currJob.fid">
                        <el-option v-for="item in stepList" :key="item" :label="item" :value="item"></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :xs="20" :sm="20" :md="12" :lg="12" :xl="12">
                    <el-form-item :label="$t('run.confirm')" label-width="0" class="seqNo">
                      <el-button type="primary" size="small" @click="handleStepConfirm()"
                        :disabled="currJob.isHand == 1 || phaseIsdis || woIdIsEnable() || currJob.isoperation == 1 || currJob.wo_id != formData.woId || currJob.job_id != currJob.fid">确
                        认</el-button>
                    </el-form-item>
                  </el-col>

                </el-row>
              </el-form>
              <div class="btnfang" style="padding-top:15px">
                <el-button type="primary" size="small" @click="sendPlcCommandManualAuto(1)"
                  :disabled="phaseIsdis || woIdIsEnable() || currJob.isHand == 1 || currJob.isoperation == 1 || currJob.wo_id != formData.woId || currJob.job_id != currJob.fid">{{ $t("run.automatic") }}</el-button>
                <el-button size="small" @click="sendPlcCommandManualAuto(0)"
                  :disabled="phaseIsdis || woIdIsEnable() || parseInt(currJob.isHand) == 0 || currJob.isoperation == 1 || currJob.wo_id != formData.woId || currJob.job_id != currJob.fid">{{ $t("run.manual") }}</el-button>
              </div>
            </div>
          </el-col>
        </el-row>
      </div>
      <!-- <div class="pagination-area">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :page-sizes="[5, 10, 15, 20]"
                    :page-size="pager.pageSize"
                    :current-page="pager.pageNum"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="pager.total"
                >
                </el-pagination>
            </div> -->
    </div>
    <el-dialog v-dialogDrag :title="$t('run.workorder_sel')" :visible.sync="dialogVisible" width="58%" :before-close="handleClose"
      :close-on-click-modal="false">
      <!-- <el-form :model="ruleForm" label-width="85px" ref="ruleForm" :rules="wordRules" size="small" :hide-required-asterisk="true">
                <el-row :gutter="24">
                    <el-col :xs="24">
                        <el-form-item label="工单选择" prop="woId" class="woid">
                            <el-select
                                v-model="ruleForm.woId"
                                remote
                                filterable
                                :remote-method="remoteMethod"
                                placeholder=""
                                v-el-select-loadmore="loadMoreFun"
                                clearable
                                @change="handleSelectWoid"
                            >
								<el-option v-for="(item,index) in workOrder" :key="index" :label="item.woId" :value="item.woId"></el-option>
							</el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24">
                        <el-form-item label="工单状态">
                            <el-input v-model="ruleForm.stateCd" placeholder="" disabled clearable></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24">
                        <el-form-item :label="$t('workorder.batch_number')">
                            <el-input v-model="ruleForm.lotNum" placeholder="" disabled clearable></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24">
                        <el-form-item :label="$t('workorder.order_number')">
                            <el-input v-model="ruleForm.poNum" placeholder="" disabled clearable></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24">
                        <el-form-item :label="$t('recipe.formula_name')">
                            <el-input v-model="ruleForm.recipeName" placeholder="" disabled clearable></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24">
                        <el-form-item :label="$t('recipe.material_code')">
                            <el-input v-model="ruleForm.item" placeholder="" disabled clearable></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form> -->
      <el-form :model="ruleForm" label-width="85px" ref="ruleForm" size="small" :hide-required-asterisk="true">
        <el-row :gutter="28">
          <el-col :xs="24" :sm="24" :md="10" :lg="7" :xl="10">
            <el-form-item :label="$t('workorder.work_order_number')" label-width=" 70px">
              <el-input v-model="ruleForm.keyword" clearable placeholder=""></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="10" :lg="7" :xl="10">
            <el-form-item :label="$t('recipe.formula_name')" label-width="70px">
              <el-input v-model="ruleForm.recipeNameKey" clearable placeholder=""></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="10" :lg="7" :xl="10">
            <el-form-item :label="$t('workorder.batch_number')" label-width="60px">
              <el-input v-model="ruleForm.lotNumKey" clearable placeholder=""></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="2" :sm="2" :md="2" :lg="2" :xl="2">
            <el-form-item label-width="0px">
              <el-button type="primary" size="small" @click="handleSearch">{{ $t("common.query") }}</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="tableAuto tableAuto1">
        <el-table :data="workOrder" v-loading="workOrderLoading" style="left:3% ;width: 95%" height="300px" @row-click="rowWorkOrderClick"
          :header-cell-style="{background:'#EAEBEC'}" ref="workOrderTable" highlight-current-row>
          <el-table-column label="" width="50" align="center">
            <template slot-scope="scope">
              <div>
                <el-radio :label="scope.row.woId" v-model="fworkOrderFid">&nbsp;</el-radio>
              </div>
            </template>
          </el-table-column>
          <el-table-column type="index" :label="$t('common.number')" width="50" align="center">
            <template slot-scope="scope">
              {{table_index1(scope.$index+1)}}
            </template>
          </el-table-column>
          <el-table-column :label="$t('workorder.work_order_number')" show-overflow-tooltip prop="woId"></el-table-column>
          <el-table-column :label="$t('recipe.formula_name')" show-overflow-tooltip prop="recipeName">
            <template slot-scope="scope">
              {{scope.row.tbRecipeVo ? scope.row.tbRecipeVo.recipeName : ''}}
            </template>
          </el-table-column>
          <el-table-column :label="$t('workorder.order_number')" show-overflow-tooltip prop="poNum"></el-table-column>
          <el-table-column :label="$t('workorder.batch_number')" show-overflow-tooltip prop="lotNum"></el-table-column>
          <el-table-column :label="$t('recipe.material_code')" show-overflow-tooltip prop="item" width="100">
            <template slot-scope="scope">
              {{scope.row.tbRecipeVo ? scope.row.tbRecipeVo.item : ''}}
            </template>
          </el-table-column>
          <el-table-column :label="$t('recipe.state')" show-overflow-tooltip prop="item" width="80">
            <template slot-scope="scope">
              {{queryStatus(scope.row.stateCd)}}
            </template>
          </el-table-column>

        </el-table>
        <div class="pagination-area" style="padding:10px 0">
          <el-pagination @size-change="handleSizeChange1" @current-change="handleCurrentChange1" :page-sizes="[10, 20, 50, 100]"
            :page-size="wordPage.pageSize" :current-page="wordPage.pageNum" layout="total, sizes, prev, pager, next, jumper"
            :total="wordPage.total">
          </el-pagination>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" size="small" @click="handleWoIdSclect('ruleForm')">{{ $t("run.confirm") }}</el-button>
        <el-button @click="handleClose()" size="small">{{ $t("common.cancel") }}</el-button>
      </span>
    </el-dialog>
    <!-- 设备选择 -->
    <el-dialog v-dialogDrag title="设备选择" :visible.sync="equipmentVisible" width="50%" :before-close="handleCloseEquipment"
      :close-on-click-modal="false">
      <div class="tableAuto">
        <el-table border :data="equipmentData" height="300px" v-loading="equipmentLoading" style="width: 100%"
          @row-click="rowClickEquipment" :header-cell-style="{background:'#EAEBEC'}" ref="refequipment" highlight-current-row>
          <el-table-column label="" width="50" align="center">
            <template slot-scope="scope">
              <div style="height:23px">
                <el-radio :label="scope.row.fid" v-model="equipmentRadioId" v-if="scope.row.fid">&nbsp;</el-radio>
              </div>
            </template>
          </el-table-column>
          <el-table-column type="index" :label="$t('common.number')" width="50" align="center">
            <template slot-scope="scope">
              {{table_index(scope.$index+1)}}
            </template>
          </el-table-column>
          <el-table-column prop="entName" label="实体名称" align="center"></el-table-column>
          <el-table-column prop="trainTxt" label="设备组" align="center"></el-table-column>
          <el-table-column prop="className" label="设备类型" align="center">
            <template slot-scope="scope">
              {{scope.row.equipmentClassVo.className}}
            </template>
          </el-table-column>
          <el-table-column prop="assetNum" label="设备编码" align="center"></el-table-column>
          <el-table-column prop="uom" label="设备状态" align="center">
            <template slot-scope="scope">
              {{scope.row.isAllocated == 1 ? '已分配' : '未分配'}}
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div class="pagination-area">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="[10, 20, 50, 100]"
          :page-size="pager1.pageSize" :current-page="pager1.pageNum" layout="total, sizes, prev, pager, next, jumper"
          :total="pager1.total">
        </el-pagination>
      </div>
      <!-- <el-form :model="equipmentForm" label-width="85px" ref="equipmentForm" :rules="equipmentRules" size="small" :hide-required-asterisk="true">
                <el-row :gutter="24">
                    <el-col :xs="24">
                        <el-form-item :label="$t('recipe.equipment')" class="selectClass" prop="equipmentId">
                            <el-select v-model="equipmentForm.equipmentId" filterable placeholder="" clearable>
                                <el-option v-for="(item,index) in equipmentList" :key="index" :label="item.entName" :value="item.fid"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form> -->
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" :loading="zyloading" size="small" @click="handleEquipmentSclect('equipmentForm')">确 认</el-button>
        <el-button @click="handleCloseEquipment()" size="small">{{ $t("common.cancel") }}</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { scheduling } from "@/api/scheduling"
import { formula } from "@/api/formula"
import { configure } from "@/api/configure"
import { plc } from "@/api/plc"
import { approvehttp } from "@/api/approve"
import { child } from "@/utlis/phaseData.js"
import material from "./template/material.vue"
import phase from "./template/phase.vue"
import dataEntry from "./template/dataEntry.vue"
import infoEntry from "./template/infoEntry.vue"
import craftConfig from "./template/craftConfig.vue"
import craftInfo from "./template/craftInfo.vue"
// import { json } from './json'
export default {
  components: {
    material,
    phase,
    dataEntry,
    infoEntry,
    craftConfig,
    craftInfo
  },
  data () {
    return {
      screenWidth: document.body.clientWidth,
      height: 'calc(100vh - 300px)',
      formData: {
        woId: "",
        lotNum: "",
        recipeId: "",
        stateCd: "",
      },
      phaseData: {
        isActive: 0,
        isAuto: 1,
        delayTime: 0.0,
        mode: 0,
        checks: 0,
      },
      stepCollapse: false,
      phaseCollapse: true,
      taskCollapse: true,
      tableStep: [{
        stepNo: "1",
        stateCd: ""
      }],
      stepVal: "",
      stepList: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31],
      activeName: "first1",
      tableData: [],
      tableLoading: false,
      header: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31],
      trIndex: null,
      tdIndex: null,
      tab_index: -1,
      child: child,
      radioId: "",
      stepObj: {},
      pager: {
        pageNum: 1,
        pageSize: 10,
        total: 0,
        keyword: ""
      },
      dialogVisible: false,
      ruleForm: {
        woId: "",
        keyword: "",
        lotNum: "",
        poNum: "",
        recipeName: "",
        recipeNameKey: "",
        lotNumKey: "",
        item: "",
        stateCd: ""
      },
      wordRules: {
        woId: [{ required: true, message: '请选择工单', trigger: 'change' }],
      },
      workOrder: [],
      wordPage: {
        pageNum: 1,
        pageSize: 20,
      },
      count: 0,
      tdLoading: false,
      phaseObj: {},
      equipmentVisible: false,
      equipmentForm: {
        equipmentId: "",
      },
      equipmentList: [],
      equipmentRules: {
        equipmentId: [{ required: true, message: '请选择设备', trigger: 'change' }],
      },
      zyloading: false,
      forms: {
        seqNo: ""
      },
      timer: null,
      childTable: false,
      currJob: {},
      isAuto: '',
      isHand: false,
      settime: null,
      isRemote: null, //远程就地
      HandShake: null, //断线状态
      returnLoading: false,
      tbRecipeVo: {},
      unitStat: -1,
      phaseIsdis: "",
      itemKey: 0,
      formsSeqNo: -1, //当前步序
      idObj: {
        opId: "",
        woId: "",
        jobId: "",
        equipmentId: "",
      },
      statusFun: '',
      equipmentData: [],
      equipmentLoading: false,
      equipmentRadioId: "",
      pager1: {
        pageSize: 10,
        pageNum: 1,
        total: 0
      },
      woidData: "",
      workOrderLoading: false,
      fworkOrderFid: ''
    }
  },
  created () {
    // this.findHmiCommon()
    // this.settime = setInterval(() => {
    //     this.findHmiCommon()
    // },5000)
    this.workOrderList()
    // this.getEquipmentSelectList()
  },
  watch: {
    screenWidth (val) {
      this.screenWidth = Number(val)
      if (this.screenWidth <= 1300) {
        this.height = 'calc(100vh - 300px)'
      } else {
        this.height = 'calc(100vh - 400px)'
      }
      console.log(this.screenWidth)
    },
  },
  computed: {
    // 单元启动按钮控制
    unitStart () {
      if (parseInt(this.currJob.statusFun) === 0) {
        return false
      } else {
        return true
      }
    },
    //单元暂停按钮控制
    unitHold () {
      if (parseInt(this.currJob.statusFun) === 10) {
        return false
      } else {
        return true
      }
    },
    //单元重启按钮控制
    unitRestart () {
      if (parseInt(this.currJob.statusFun) === 21) {
        return false
      } else {
        return true
      }
    },
    //单元结束按钮控制
    unitDone () {
      if (parseInt(this.currJob.isHand) === 1) {
        return true
      } else if (parseInt(this.currJob.isHand) === 0) {
        if (parseInt(this.currJob.statusFun) === 10) {
          return false
        } else if (parseInt(this.currJob.statusFun) == 21) {
          return false
        } else if (parseInt(this.currJob.statusFun) == 51) {
          return false
        } else {
          return true
        }
      } else {
        return true
      }
    },
    //单元异常退出按钮控制
    unitAbort () {
      if (parseInt(this.currJob.statusFun) == 21) {
        return false
      } else {
        return true
      }
    },
    //单元重置按钮控制
    unitReset () {
      if (parseInt(this.currJob.statusFun) == 11 || parseInt(this.currJob.statusFun) == 51) {
        return false
      } else {
        return true
      }
    },
    isUnitConfirm () {
      let arr = [0, 4, 7, 8]
      if (arr.indexOf(parseInt(this.stepObj.serialNo)) > -1) {
        return false
      } else {
        return true
      }
    },
    isStep () {
      if (parseInt(this.stepObj.seqNo || 0) == this.formsSeqNo) {
        return false
      } else {
        return true
      }
    },
  },
  mounted () {
    const that = this
    window.addEventListener('resize', function () {
      that.screenWidth = document.body.offsetWidth;
    })
  },
  methods: {
    getTaskList () {
      const param = {
        page: this.pager.pageNum,
        size: 99999999,
        recipeId: this.formData.recipeId,
        woId: this.formData.woId
      }
      this.tableLoading = true
      formula.operationList(param).then(res => {
        if (res.code == 200) {
          this.tableData = res.data.rows
          let fidList = []
          this.tableData.forEach(item => {
            item.child = JSON.parse(JSON.stringify(this.child))
            fidList.push(item.fid)
          })
          clearInterval(this.settime)
          clearInterval(this.timer)
          this.queryPlcData(fidList)
          // this.timer = setInterval(() => {
          //   this.queryPlcData(fidList)
          // }, 5000)
          this.pager.total = res.data.total
          this.tableLoading = false
        } else {
          this.tableLoading = false
        }
      }).catch(e => {
        this.$message.error('服务器繁忙,请稍后再试');
      })
    },
    findHmiCommon () {
      plc.plcFind([]).then(res => {
        if (res.code == 200) {
          const el = res.data.find(item => item.unitName == 'hmiCommon')
          let item = el.data.find(item => item.ValueName == 'HmiCommon_isRemote') || {};
          this.isRemote = item.RealValue;
          let item1 = el.data.find(item => item.ValueName == 'HmiCommon_HandShake') || {};
          this.HandShake = item1.RealValue;
        }
      })
    },
    handleSizeChange (val) {

      this.pager1.pageSize = val
      this.getEquipmentSelectList()
    },
    handleCurrentChange (val) {
      this.pager1.pageNum = val
      this.getEquipmentSelectList()
    },
    rowClick (row) {
      this.radioId = row.fid;
      this.$set(this, "currJob", row)
      this.stepVal = row.actStep >= 0 ? row.actStep : ""
      this.forms.seqNo = row.actStep >= 0 ? row.actStep : ""
      this.formsSeqNo = this.forms.seqNo
      this.idObj.opId = row.opId
      this.idObj.woId = row.woId
      this.idObj.jobId = row.fid
      this.idObj.equipmentId = row.equipmentId
      this.stepObj = {}
      this.count++
      this.statusFun = this.currJob.statusFun
      this.$refs.refTable.toggleRowExpansion(row)
      this.$refs.refTable.setCurrentRow(row);
    },
    async handledetail (row, expandedRows) {
      this.radioId = row.fid;
      this.$set(this, "currJob", row)
      this.stepVal = row.actStep >= 0 ? row.actStep : ""
      this.forms.seqNo = row.actStep >= 0 ? row.actStep : ""
      this.formsSeqNo = this.forms.seqNo
      this.idObj.opId = row.opId
      this.idObj.woId = row.woId
      this.idObj.jobId = row.fid
      this.idObj.equipmentId = row.equipmentId
      console.log(row)
      console.log(this.$refs.refTable)
      this.$refs.refTable.setCurrentRow(row);
      if (expandedRows.length > 0) {
        this.childTable = true
        let param = {
          eqpClassId: row.equipmentClassVo ? row.equipmentClassVo.fid : ''
        }
        let res1 = await configure.getEqpClassPhaseLinkList(param)
        if (res1.code == 200) {
          const index = this.tableData.findIndex(item => item.fid == row.fid)
          this.tableData[index].child.forEach(item => {
            item.display = false
            res1.data.rows.forEach(item1 => {
              item1.phaseDefineVo = item1.phaseDefineVo ? item1.phaseDefineVo : {}
              if (item1.phaseDefineVo.sn == item.title) {
                item.display = true
                if (item1.phaseDefineVo.name) {
                  item.text = item1.phaseDefineVo.name
                }
                return
              }
            })
          })
          formula.findByOperationId(row.opId).then(res => {
            if (res.code == 200) {
              const index = this.tableData.findIndex(item => item.fid == row.fid)
              this.tableData[index].child.forEach(item => {
                this.$set(item, "stepVos", [])
                res.data.forEach(el => {
                  if (el.serialNo == item.id) {
                    item.stepVos.push(el)
                  }
                })
              })
              console.log(this.tableData[index])
              // return

              let phaseVos = this.tableData[index].phaseVos.filter(item => item.isActive == 1)
              this.tableData[index].phaseVos = phaseVos.sort(this.sortArr)
              console.log(this.tableData[index].phaseVos)
              this.itemKey = new Date().getTime()
              this.childTable = false
            } else {
              const index = this.tableData.findIndex(item => item.fid == row.fid)
              this.tableData[index].child.forEach(item => {
                this.$set(item, "stepVos", [])
              })
              this.itemKey = new Date().getTime()
              this.childTable = false
            }
          })
        }
      } else {
        const index = this.tableData.findIndex(item => item.fid == row.fid)
        this.tableData[index].child.forEach(item => {
          this.$set(item, "stepVos", [])
        })
        this.itemKey = new Date().getTime()
      }
    },
    rowClickChild (row) {
      if (this.tdLoading) {
        return
      }
      console.log(row.unitStat)
      this.stepObj = {}
      this.tdLoading = true
      let currRow = this.tableData.find(item => item.fid == this.radioId) //当前点击的作业
      console.log(currRow)
      this.$set(this, "currJob", currRow)
      this.stepVal = currRow.actStep >= 0 ? currRow.actStep : ""
      this.forms.seqNo = currRow.actStep >= 0 ? currRow.actStep : ""
      this.formsSeqNo = this.forms.seqNo
      this.idObj.opId = currRow.opId
      this.idObj.woId = currRow.woId
      this.idObj.jobId = currRow.fid
      this.idObj.equipmentId = currRow.equipmentId
      this.unitStat = row.unitStat
      this.statusFun = row.statusFun
      this.woidData = ""
      formula.phaseFind(row.fid).then(res => {
        this.tdLoading = false
        if (res.code == 200) {
          this.stepObj = Object.assign({}, res.data)
          console.log(this.stepObj)
          this.count++
        }
      }).catch(e => {
        this.tdLoading = false
      })
      // this.stepObj = {}
      console.log(row)
      console.log(this.tableData)
      // this.stepObj = row
      // this.count ++
    },
    handleTD (trIndex, tdIndex, id, title, modeId, unitStat, fid, statusFun) {
      if (this.tdLoading) {
        return
      }
      this.tdLoading = true
      this.radioId = fid
      let currRow = this.tableData.find(item => item.fid == this.radioId) //当前点击的作业
      this.$set(this, "currJob", currRow)
      this.stepVal = currRow.actStep >= 0 ? currRow.actStep : ""
      this.forms.seqNo = currRow.actStep >= 0 ? currRow.actStep : ""
      this.formsSeqNo = this.forms.seqNo
      this.idObj.opId = currRow.opId
      this.idObj.woId = currRow.woId
      this.idObj.jobId = currRow.fid
      this.idObj.equipmentId = currRow.equipmentId
      this.$refs.refTable.setCurrentRow(currRow);
      this.woidData = ""
      if (currRow.phaseVos && currRow.phaseVos.length) { //如果已经新增过阶段信息
        let index = currRow.phaseVos.findIndex(item => {
          return item.serialNo == modeId && item.seqNo == tdIndex - 1
        })
        if (index > -1) { //阶段信息已经新增过
          formula.phaseFind(currRow.phaseVos[index].fid).then(res => {
            this.tdLoading = false
            if (res.code == 200) {
              console.log(res.data)
              this.stepObj = Object.assign({}, res.data)
              this.count++
            }
          }).catch(e => {
            this.tdLoading = false
          })


        } else { //某一列第一次新增步序
          this.stepObj = { phaseDesc: title, seqNo: tdIndex - 1, mode: 0, texts: '', stepNo: tdIndex - 1, serialNo: modeId }
          // this.stepObj = Object.assign({},{phaseDesc:title,mode:modeId})
          this.count++
          this.tdLoading = false
          console.log(this.stepObj)
        }
      } else { //没有phaseVos就是一个步序都没新增过
        this.stepObj = { phaseDesc: title, seqNo: tdIndex - 1, mode: 0, texts: '', stepNo: tdIndex - 1, serialNo: modeId }
        this.count++
        this.tdLoading = false
        console.log(this.stepObj)
      }
      this.unitStat = unitStat
      this.trIndex = trIndex
      this.tdIndex = tdIndex
      this.statusFun = statusFun
      this.tab_index = id
    },
    handleSearch () {
      this.fworkOrderFid = ""
      this.wordPage.pageNum = 1
      this.workOrderList()
    },
    //获取工单
    workOrderList () {
      const param = {
        page: this.wordPage.pageNum,
        size: this.wordPage.pageSize,
        woId: this.ruleForm.keyword,
        tbRecipeVo: {
          recipeName: this.ruleForm.recipeNameKey
        },
        lotNum: this.ruleForm.lotNumKey,
        stateCds: [1, 2, 4],
        field: 'creatTimeLocal',
        order: 'DESC',
      }
      this.workOrderLoading = true
      scheduling.workOrderList(param).then(res => {
        if (res.code == 200) {
          this.workOrder = res.data.rows
          this.wordPage.total = res.data.total
        }
        this.workOrderLoading = false
      })
    },
    handleSizeChange1 (val) {
      this.wordPage.pageNum = 1
      this.wordPage.pageSize = val
      this.workOrderList()
    },
    handleCurrentChange1 (val) {
      this.wordPage.pageNum = val
      this.workOrderList()
    },

    unique (arr) {
      return Array.from(new Set(arr))
    },
    //查询plc数据
    queryPlcData (id) {
      plc.plcFind(id).then(res => {
        // res = json
        // console.log(JSON.stringify(res))
        console.log(res)
        if (res.code == 200) {
          try {
            const element = res.data.find(item4 => item4.unitName == 'hmiCommon') || {}
            let hmiCommon = element.data.find(item4 => item4.ValueName == 'HmiCommon_isRemote') || {};
            this.isRemote = hmiCommon.RealValue;
            let hmiCommon1 = element.data.find(item5 => item5.ValueName == 'HmiCommon_HandShake') || {};
            this.HandShake = hmiCommon1.RealValue;
          } catch (e) { }
          this.tableData.forEach(item => {
            item.equipmentVo = item.equipmentVo ? item.equipmentVo : {}
            let unitObj = res.data.find(el => el.unitName == item.equipmentVo.entName)

            if (unitObj) {
              console.log(unitObj)
              if (unitObj.data && unitObj.data.length > 0) {
                // let index = unitObj.data.findIndex(el1 => {
                //     return item.equipmentVo && (el1.ValueName == "jobName" && el1.RealValue == item.equipmentVo.entName)
                // })
                //unitCommon_stat  作业状态
                //unitCommon_displayStep  步序
                //unitCommon_autoHand  单元手动自动  目前全手动
                //unitCommon_condition  单元条件
                // console.log(index)
                // if(index > -1){
                if (item.equipmentVo.entName == unitObj.unitName) {
                  //获取当前工单号
                  let woid = unitObj.data.find(el6 => el6.ValueName == "UnitDB_" + item.equipmentVo.entName + "_unitCommon_wo_id") || {}
                  //获取当前作业号
                  let job_id = unitObj.data.find(el6 => el6.ValueName == "UnitDB_" + item.equipmentVo.entName + "_unitCommon_job_id") || {}
                  //作业状态
                  let jobStatus = unitObj.data.find(el2 => el2.ValueName == "UnitDB_" + item.equipmentVo.entName + "_unitCommon_stat") || {}
                  // 手动自动
                  let jobAutoHand = unitObj.data.find(el3 => el3.ValueName == "UnitDB_" + item.equipmentVo.entName + "_unitCommon_autoHand") || {}
                  //单元条件
                  let condition = unitObj.data.find(el4 => el4.ValueName == "UnitDB_" + item.equipmentVo.entName + "_unitCommon_condition") || {}
                  //获取步序执行到哪一步  UnitDB_R3102_unitCommon_displayStep
                  let actStep = unitObj.data.find(el6 => el6.ValueName == "UnitDB_" + item.equipmentVo.entName + "_unitCommon_displayStep") || {}
                  let handStepEnable = unitObj.data.find(el7 => el7.ValueName == "UnitDB_" + item.equipmentVo.entName + "_unitCommon_handStepEnable") || {}

                  try {
                    if (parseInt(handStepEnable.RealValue) === 0 || parseInt(handStepEnable.RealValue === 1)) {
                      handStepEnable.RealValue = parseInt(handStepEnable.RealValue)
                    } else {
                      let RealValue = handStepEnable.RealValue
                      if (RealValue.toLocaleLowerCase() == 'true') {
                        handStepEnable.RealValue = 1
                      } else {
                        handStepEnable.RealValue = 0
                      }
                    }

                  } catch (e) { }
                  console.log(handStepEnable.RealValue)
                  if (woid.RealValue == this.formData.woId && job_id.RealValue == item.fid) { //对比当前工单号和读取的Unit的工单号作业号
                    this.$set(item, "statusFun", parseInt(jobStatus.RealValue))
                    this.$set(item, "isHand", parseInt(jobAutoHand.RealValue))
                    this.$set(item, "condition", parseInt(condition.RealValue))
                    this.$set(item, "StepEnable", parseInt(handStepEnable.RealValue))
                    this.$set(item, "actStep", parseInt(actStep.RealValue))
                    this.$set(item, "job_id", job_id.RealValue)
                    this.$set(item, "wo_id", woid.RealValue)
                    this.$set(item, "isoperation", 0)
                  } else if (!woid.RealValue && !job_id.RealValue) {
                    this.$set(item, "statusFun", parseInt(jobStatus.RealValue))
                    this.$set(item, "job_id", job_id.RealValue)
                    this.$set(item, "wo_id", woid.RealValue)
                    this.$set(item, "isoperation", 1)
                    this.$set(item, "statusFun", parseInt(jobStatus.RealValue))
                    this.$set(item, "isHand", parseInt(jobAutoHand.RealValue))
                    this.$set(item, "condition", parseInt(condition.RealValue))
                    this.$set(item, "StepEnable", parseInt(handStepEnable.RealValue))
                    this.$set(item, "actStep", parseInt(actStep.RealValue))
                  } else {
                    this.$set(item, "job_id", job_id.RealValue)
                    this.$set(item, "wo_id", woid.RealValue)
                  }
                  if (item.fid == this.currJob.fid && woid.RealValue == this.formData.woId && job_id.RealValue == item.fid) { //更新当前选中
                    this.$set(this.currJob, "statusFun", parseInt(jobStatus.RealValue))
                    this.$set(this.currJob, "condition", parseInt(condition.RealValue))
                    this.$set(this.currJob, "isHand", parseInt(jobAutoHand.RealValue))
                    this.$set(this.forms, "seqNo", actStep.RealValue >= 0 ? parseInt(actStep.RealValue) : '')
                    this.$set(item, "job_id", job_id.RealValue)
                    this.$set(item, "wo_id", woid.RealValue)
                    // this.$set(this.currJob,"actStep",parseInt(actStep.RealValue))
                    this.$set(this.currJob, "StepEnable", parseInt(handStepEnable.RealValue))
                    this.$set(item, "isoperation", 0)
                    this.formsSeqNo = this.forms.seqNo
                  } else if (item.fid == this.currJob.fid && !woid.RealValue && !job_id.RealValue) {
                    this.$set(this.currJob, "statusFun", parseInt(jobStatus.RealValue))
                    this.$set(item, "job_id", job_id.RealValue)
                    this.$set(item, "wo_id", woid.RealValue)
                    this.$set(item, "isoperation", 1)
                  } else {
                    this.$set(item, "job_id", job_id.RealValue)
                    this.$set(item, "wo_id", woid.RealValue)
                  }

                  let phase = []
                  unitObj.data.forEach(item1 => {
                    let obj = item.child.find(el5 => {
                      // el5.title == item1.RealValue
                      let title = "UnitDB_" + item.equipmentVo.entName + "_" + el5.title + "[" + actStep.RealValue + "]" + "_Common_name"
                      return title == item1.ValueName
                    })
                    if (obj) {
                      phase.push(obj.title)
                      phase = this.unique(phase)
                    }
                  })
                  // let isActive = {}
                  console.log(phase)
                  phase.forEach(ele => {
                    //获取阶段状态 UnitDB_R3103_PH_AGI[0]_Common_stat
                    let unitStat = unitObj.data.find(el7 => el7.ValueName == "UnitDB_" + item.equipmentVo.entName + "_" + ele + "[" + actStep.RealValue + "]" + "_Common_stat") || {}
                    // const key = item.child.findIndex(ele1 => ele1.title == ele)
                    // this.$set(item.child[key],"unitStat",(unitStat.RealValue))
                    item.phaseVos.forEach(items => {
                      if (items.phaseCode == ele) {
                        items.unitStat = unitStat.RealValue
                      }
                    })
                    //阶段是否有效 1有效，0无效
                    // isActive[ele] = unitObj.data.find(el8 => el8.ValueName == "UnitDB_"+item.equipmentVo.entName+"_"+ele+"["+actStep.RealValue+"]"+"_Common_active") || {}

                  })


                  if (parseFloat(item.statusFun) === 0) {
                    item.child.forEach(items => {
                      if (items.stepVos && items.stepVos.length > 0) {
                        items.stepVos.forEach(els => {
                          this.$set(els, "stateCd", null)
                          // els.stateCd = null
                        })
                      }
                    })
                  }

                  //    console.log(isActive)
                  // if(item.statusFun == 10){ //启动的状态才去查询步序


                  // item.child.forEach(item2 => {
                  //     this.$set(item2,"actStep",false)
                  //     phase.forEach(item3 => {
                  //         if(item2.title == item3){
                  //             this.$set(item2,"actStep",true)
                  //         }
                  //     })
                  // })
                  // }


                }
              }
            }
            // }

          })
          console.log(this.tableData)
          this.itemKey = new Date().getTime()
        } else {
          // clearInterval(this.timer)
        }
      }).catch(e => {
        // clearInterval(this.timer)
      })
    },
    handleBatchselect () {
      this.dialogVisible = true
    },
    handleWoIdSclect (formName) {
      if (!this.fworkOrderFid) {
        this.$message.error('请选择工单');
        return
      }
      let item = this.workOrder.find(item => item.woId == this.ruleForm.woId)
      console.log(item)
      this.formData.woId = item.woId
      this.formData.lotNum = item.lotNum
      this.formData.recipeName = item.tbRecipeVo.recipeName
      this.formData.recipeId = item.tbRecipeVo.fid
      this.formData.stateCd = item.stateCd
      this.pager.pageNum = 1
      this.getTaskList()
      this.radioId = ""
      this.phaseIsdis = this.isDisabled(item.stateCd)
      this.woidData = item.woId
      this.stepObj = {}
      this.count++
      this.dialogVisible = false

      // this.$refs[formName].validate((valid) => {
      //     if(valid){
      //         let item = this.workOrder.find(item => item.woId == this.ruleForm.woId)
      //         console.log(item)
      //         this.formData.woId = item.woId
      //         this.formData.lotNum = item.lotNum
      //         this.formData.recipeName = item.tbRecipeVo.recipeName
      //         this.formData.recipeId = item.tbRecipeVo.fid
      //         this.formData.stateCd = item.stateCd
      //         this.pager.pageNum = 1
      //         this.getTaskList()
      //         this.radioId = ""
      //         this.phaseIsdis = this.isDisabled(item.stateCd)
      //         this.woidData = item.woId
      //         this.stepObj = {}
      //         this.count ++
      //         this.dialogVisible = false
      //     }
      // })
    },
    handleClose () {
      this.dialogVisible = false
    },
    handleCloseEquipment () {
      this.equipmentVisible = false
      this.equipmentData = [];
    },
    handleWoidStatus (type) {
      if (!this.formData.woId) {
        this.$message.error('请选择工单');
        return
      }
      let that = this
      this.$customConfirm({
        content: '是否要' + that.queryStatus(type) + '工单' + this.formData.woId,
        onok () {
          const param = {
            stateCd: type,
            woId: that.formData.woId
          }
          scheduling.modifyStatus(param).then(res => {
            if (res.code == 200) {
              that.formData.stateCd = type
              that.workOrder = []
              that.phaseIsdis = that.isDisabled(type)
              that.workOrderList()
              if (type == 3 || type == 5) {
                that.addAapprove()
              }
              that.count++
              that.$message({ duration: 1000, type: 'success', message: that.queryStatus(type) + '成功!' });
              that.$forceUpdate()
            } else {
              that.$message.error(res.message);
            }
          })
        }
      })
    },
    //添加审批记录
    addAapprove () {
      const param = {
        woId: this.formData.woId,
        stateCd: '',
        actStartTimeUtc: '',
        woApproveLogVos: [{
          woId: this.formData.woId
        }, {
          woId: this.formData.woId
        }, {
          woId: this.formData.woId
        }, {
          woId: this.formData.woId
        }]
      }
      approvehttp.woApproveLogAdd(param).then(res => {

      })
    },

    async handleEquipment (currend) {
      // if(this.returnLoading){
      //     this.$message.error('请勿频繁操作');
      //     return
      // }
      if (!this.formData.woId) {
        this.$message.error('请选择工单');
        return
      }
      if (this.radioId === '') {
        this.$message.error('请选择作业');
        return
      }
      console.log(currend)

      if (currend.equipmentClassVo != null && currend.equipmentClassVo.fid != '') {
        this.getEquipmentSelectList(currend.equipmentClassVo.fid, currend.equipmentVo.entName)
      }
      this.equipmentVisible = true
      return
      this.returnLoading = true
      try {
        let res = await formula.operationFind(this.radioId)
        if (res.code == 200) {
          this.equipmentForm = {
            jobDesc: res.data.jobDesc,
            initSchedEntId: res.data.initSchedEntId,
            seqNo: res.data.seqNo,
            nextJob: res.data.nextJob,
            firstJob: res.data.firstJob,
            finalJob: res.data.finalJob,
            fid: res.data.fid,
            equipmentId: res.data.equipmentVo ? res.data.equipmentVo.fid : "",
            recipeId: res.data.recipeId,
          }
          this.getEquipmentList()
        } else {
          this.$message.error(res.msg);
        }
      } catch (e) {
        this.returnLoading = false
      }


    },
    async getEquipmentList (classId, entName) {
      this.tbRecipeVo.trainVo = this.tbRecipeVo.trainVo || {}
      const params = {
        equipmentVo: {
          entName: entName == '' ? this.currJob.equipmentVo.entName : entName,
          classId: classId == '' ? this.currJob.equipmentClassVo.fid : classId,
        },
        trainId: this.tbRecipeVo.trainVo.fid
      }
      this.returnLoading = false
      let res = await configure.getTrainEquipLinkList(params)
      console.log(res)
      if (res.code == 200) {
        this.equipmentList = res.data.rows.map(el => {
          return {
            entName: el.equipmentVo ? el.equipmentVo.entName : "",
            fid: el.equipmentVo ? el.equipmentVo.fid : ""
          }
        })
        console.log(this.equipmentList)
        this.equipmentVisible = true
      } else {
        this.$message.error(res.msg);
      }
    },
    handleEquipmentSclect (formName) {
      if (this.equipmentRadioId === '') {
        this.$message.error('请选择设备');
        return
      }
      this.zyloading = true
      const param = {
        equipmentId: this.equipmentRadioId,
        fid: this.radioId
      }
      formula.jobModify(param).then(res => {
        if (res.code == 200) {
          this.$message({ duration: 1000, type: 'success', message: '设备更改成功!' });
          this.equipmentVisible = false
          this.equipmentData = [];
        } else {
          this.$message.error(res.msg);
        }
        this.zyloading = false
      })


    },

    handleEditPlcStatus (type, text) {
      if (this.radioId === '') {
        this.$message.error('请选择作业');
        return
      }
      if (type == 10) {
        this.currJob.equipmentVo = this.currJob.equipmentVo || {}

        // if (this.currJob.statusFun != 0) {
        //   this.$message.error(this.currJob.equipmentVo.entName + "状态不满足，不能被选择");
        //   return
        // }
        if (this.currJob.statusFun == 0) {
          if (this.currJob.statusFun == 1) {
            this.$message.error(this.currJob.equipmentVo.entName + "在CIP，不能被选择");
            return
          } else if (this.currJob.statusFun == 3) {
            this.$message.error(this.currJob.equipmentVo.entName + "不清洁，不能被选择");
            return
          } else if (this.currJob.statusFun == 4) {
            this.$message.error(this.currJob.equipmentVo.entName + "在生产，不能被选择");
            return
          }
        }
      }
      let that = this
      this.$customConfirm({
        content: '是否要' + text + '单元作业' + this.currJob.jobDesc,
        onok () {
          const param = {
            fid: that.radioId,
            stateCd: type
          }
          plc.sendPlcCommandUnit(param).then(res => {
            if (res.code == 200) {
              if (type == 60) { //如果重置 表格颜色全部清除
                that.childTable = true
                formula.findByOperationId(that.currJob.opId).then(res => {
                  that.childTable = false
                  if (res.code == 200) {
                    const index = that.tableData.findIndex(item => item.fid == that.currJob.fid)
                    that.tableData[index].actStep = ''
                    that.tableData[index].child.forEach(item => {
                      that.$set(item, "stepVos", [])
                      if (that.$util.isNumber(item.unitStat)) {
                        item.unitStat = null
                      }
                      res.data.forEach(el => {
                        el.stateCd = null
                        if (el.serialNo == item.id) {
                          item.stepVos.push(el)
                        }
                      })

                    })
                    that.itemKey = new Date().getTime()
                    console.log(that.tableData)
                  } else {
                    const index = that.tableData.findIndex(item => item.fid == row.fid)
                    that.tableData[index].child.forEach(item => {
                      that.$set(item, "stepVos", [])
                    })
                    that.itemKey = new Date().getTime()
                    console.log(that.tableData)
                  }
                })
              }
              that.$message({ duration: 1000, type: 'success', message: '修改成功!' });
            } else {
              that.$message.error(res.msg);
            }
          })
        },
      })
    },
    sendPlcCommandManualAuto (type) {
      if (!this.radioId) {
        this.$message.error('请选择作业');
        return
      }
      // if(type === 0){
      //     if(this.stepVal === ''){
      //         this.$message.error('请选择步序');
      //         return
      //     }
      // }
      let that = this
      this.isAuto = type
      let tip = type == 1 ? '自动' : '手动'
      console.log(that.stepObj)
      this.$customConfirm({
        content: '是否要改为' + tip,
        onok () {
          const param = {
            fid: that.radioId,
            manualAuto: type,
            // seqNo: that.stepVal,
          }
          plc.sendPlcCommandManualAuto(param).then(res => {
            if (res.code == 200) {
              const index = that.tableData.findIndex(item => item.fid == that.fid)
              that.$set(that.tableData[index], "isHand", type)
              that.$set(that.currJob, "isHand", type)
            }
          })
        },
      })
    },
    handleStepConfirm () {
      if (this.stepVal === '') {
        this.$message.error('请选择步序');
        return
      }
      if (!this.radioId) {
        this.$message.error('请选择作业');
        return
      }
      if (this.currJob.StepEnable != 1) {
        this.$message.error('请完成所有phase再进行跳步');
        return
      }
      let that = this
      this.$customConfirm({
        content: '是否要确认',
        onok () {
          const param = {
            fid: that.radioId,
            manualAuto: this.isAuto,
            stepTrig: 1,
            seqNo: that.stepVal,
          }
          plc.sendPlcCommandManualAuto(param).then(res => {
            if (res.code == 200) {
              const index = that.tableData.findIndex(item => item.fid == that.radioId)
              that.tableData[index].isHand = that.isAuto
            }
          })
        },
      })
    },
    // handleSelectWoid(val){
    //     const item = this.workOrder.find(el => el.woId == val)
    //     this.ruleForm.lotNum = item.lotNum
    //     this.ruleForm.poNum = item.poNum
    //     item.tbRecipeVo = item.tbRecipeVo ? item.tbRecipeVo : {}
    //     this.ruleForm.recipeName = item.tbRecipeVo.recipeName
    //     this.ruleForm.item = item.tbRecipeVo.item
    //     this.ruleForm.stateCd = this.queryStatus(item.stateCd)
    //     this.tbRecipeVo = item.tbRecipeVo
    // },
    rowWorkOrderClick (row) {
      let val = row.woId
      const item = this.workOrder.find(el => el.woId == val)
      this.ruleForm.lotNum = item.lotNum
      this.ruleForm.poNum = item.poNum
      item.tbRecipeVo = item.tbRecipeVo ? item.tbRecipeVo : {}
      this.ruleForm.recipeName = item.tbRecipeVo.recipeName
      this.ruleForm.item = item.tbRecipeVo.item
      this.ruleForm.stateCd = this.queryStatus(item.stateCd)
      this.tbRecipeVo = item.tbRecipeVo
      this.fworkOrderFid = row.woId
      this.ruleForm.woId = row.woId
      this.$refs.formulaTable.setCurrentRow(row);
    },
    table_index (index) {
      return (this.pager.pageNum - 1) * this.pager.pageSize + index
    },
    tableRowClassName ({ row }) {
      if (parseInt(row.statusFun) == 10) {
        return 'yunxing';
      } else if (parseInt(row.statusFun) == 11) {
        return 'wancheng';
      } else {
        return '';
      }
    },
    queryStatus (type) {
      switch (type) {
        case 0:
          return this.$t('workorder.newly_build')
        case 1:
          return this.$t('workorder.release')
        case 2:
          return this.$t('workorder.function')
        case 3:
        case 6:
          return this.$t('workorder.finish')
        case 4:
          return this.$t('workorder.suspend')
        case 5:
          return this.$t('common.abandoned')
        case 7:
          return this.$t('common.examine')
        case 8:
          return this.$t('common.approval')
        case 9:
          return this.$t('common.refuse')
      }
    },
    isDisabled (stateCd) {
      if (stateCd == 0 || stateCd == 1 || stateCd == 3 || stateCd == 6 || stateCd == 5) {
        return true
      }
      return false
    },

    statusStyle (stateCd) {
      return 'stayus' + (stateCd)
    },
    queryJobstate (type) {
      switch (type) {
        case 0:
          return "准备"
        case 10:
          return this.$t('workorder.function')
        case 11:
          return this.$t('workorder.finish')
        case 21:
          return this.$t('workorder.suspend')
        case 41:
          return "停止"
        case 51:
          return "异常退出"
        default:
          return ""
      }
    },
    getJobNameColor (type) {
      if (type == 10) {
        return "lv"
      } else if (type == 11) {
        return "phaseHuang"
      } else if (type == 21) {
        return "phaseHong"
      } else if (type == 51) {
        return "pinhong"
      } else if (parseInt(type) === 0) {
        return "hui"
      } else {
        return ''
      }
    },
    /**
     * @param step1 当前执行的步序
     * @param step2 表头下标
     * @param actStep plc返回数据里有没有的阶段
     * @param stepVos 步序数据
     * @param unitStat 当前步序状态
     * @param  stateCd  走过去的步序状态
    */
    getColor (step1, step2, stepVos, unitStat, stateCd) {
      if (step1 > step2 && stepVos.seqNo == step2 && stepVos.isActive == 1) {
        if (stateCd == 10) {
          return "lv"
        } else if (stateCd == 11) {
          return "phaseHuang"
        } else if (stateCd == 21) {
          return "phaseHong"
        } else if (stateCd == 51) {
          return "pinhong"
        } else if (parseInt(stateCd) === 0) {
          return "hui"
        } else {
          return ''
        }
      } else if (step1 == step2 && stepVos.seqNo == step2 && stepVos.isActive == 1) {
        if (unitStat == 10) {
          return "lv"
        } else if (unitStat == 11) {
          return "phaseHuang"
        } else if (unitStat == 21) {
          return "phaseHong"
        } else if (unitStat == 51) {
          return "pinhong"
        } else if (parseInt(unitStat) === 0) {
          return "hui"
        } else {
          return ''
        }
      } else {
        return ""
      }
    },
    //当前步序走到了哪  给个样式
    getStepColor (step1, step2) {
      if (parseInt(step1) === parseInt(step2)) {
        return 'borderColor'
      } else {
        return ''
      }
    },
    getHeaderBottom (step1, step2, child) {
      let arr = child.filter(item => item.display)
      if (arr.length == 0 && parseInt(step1) === parseInt(step2)) {
        return 'bottomColor'
      } else {
        return ''
      }
    },
    getStepBottom (index, step1, step2, child) {
      let keys = 0
      for (let i = 0; i < child.length; i++) {
        if (child[i].display) {
          keys = i
        }
      }
      if (index == keys && parseInt(step1) === parseInt(step2)) {
        return 'bottomColor'
      } else {
        return ''
      }
    },
    getStepTop (step1, step2) {
      if (parseInt(step1) === parseInt(step2)) {
        return 'topColor'
      } else {
        return ''
      }
    },
    // 判断工单废弃  结束或者没有选择工单 按钮全部禁掉
    woIdIsEnable () {
      if (this.formData.stateCd == 5 || this.formData.stateCd == 3 || this.formData.stateCd == 6 || !this.formData.woId) {
        return true
      } else {
        return false
      }
    },
    handleSelectEquipment (classId) {


    },
    rowClickEquipment (row) {
      this.equipmentRadioId = row.fid
      this.$refs.refequipment.toggleRowExpansion(row)
      this.$refs.refequipment.setCurrentRow(row);
    },
    getEquipmentSelectList (classId, entName) {
      console.log(this.currJob)
      const param = {
        entName: entName === undefined ? this.currJob.equipmentVo.entName : entName,
        classId: classId === undefined ? this.currJob.equipmentClassVo.fid : classId,
        page: this.pager1.pageNum,
        size: this.pager1.pageSize,
        field: this.pager1.field,
        order: this.pager1.order,
      }
      configure.getEquipmentList(param).then(res => {
        if (res.code == 200) {
          this.equipmentData = res.data.rows
          this.equipmentData.forEach(item => {
            item.trainTxt = ''
            if (item.trainVos && item.trainVos.length > 0) {
              item.trainVos.forEach((item1, index) => {
                item.trainTxt += index < item.trainVos.length - 1 ? item1.entName + "，" : item1.entName
              })
            }
          })

          this.pager1.total = res.data.total
        }
      })
    },
    handleConfirm (row, type) {
      if (!row) {
        this.$message.error('请选择阶段');
        return
      }
      let that = this
      const param = {
        fid: row.fid,
        stateCd: type
      }
      plc.sendPlcCommandPhase(param).then(res => {
        if (res.code == 200) {
          if (that.stepObj.serialNo == 7) {
            that.submitDescribeCommand()
          }
          that.$message({ duration: 1000, type: 'success', message: '确认成功!' });
        }
      })
    },
    //阶段描述
    submitDescribeCommand () {
      const param = {
        type: 2,
        flastModifyComment: this.formData.textarea,
        level: 3,
        unitId: this.idObj.equipmentId,
        woId: this.woId,
        phaseId: this.stepObj.fid,
        jobId: this.idObj.jobId
      }
      plc.submitDescribeCommand(param).then(res => {

      })
    },
    getRowKey (row) {
      return row.fid
    },
    sortArr (a, b) {
      if (a.seqNo == b.seqNo) {
        return a.stepSort - b.stepSort;
      }
      return a.seqNo - b.seqNo;
    },
    table_index1 (index) {
      return (this.wordPage.pageNum - 1) * this.wordPage.pageSize + index
    },
  },

  destroyed () {
    clearInterval(this.settime)
    clearInterval(this.timer)
  }
}
</script>

<style scoped>
.title {
  line-height: 35px;
  background: #3b2e58;
  color: #fff;
  padding: 0 15px;
  font-size: 14px;
}
.zhedie {
  float: right;
  line-height: 35px;
  font-size: 18px;
  cursor: pointer;
}
.marginBottom {
  margin-bottom: 15px;
}
.marginBottom >>> .el-tabs--border-card {
  box-shadow: none;
}
.table_form {
  width: 100%;
  border-top: 1px solid #dedfe3;
  border-left: 1px solid #dedfe3;
}
thead {
  background: #f9f9f9;
}
thead td {
  font-weight: bold;
}
.table_form td,
.table_form th {
  border-right: 1px solid #dedfe3;
  border-bottom: 1px solid #dedfe3;
  text-align: center;
  min-width: 30px;
  padding: 6px 5px;
}
.tableAuto >>> .el-table__expanded-cell {
  padding: 0px 0;
}
.tableAuto >>> .el-table__body-wrapper {
  overflow: auto;
}
.XYaxis {
  background: #bcb3d8 !important;
  color: #fff !important;
}

.btngroup {
  text-align: center;
  padding-top: 10px;
}
.btngroup >>> .el-button {
  /* margin-left: 0; */
  margin-right: 5px;
  margin-top: 10px;
  width: 45%;
  text-align: center;
  min-width: 100px;
}
.woid >>> .el-select {
  width: 100%;
}
.firstworkOrder {
  border-left: 2px solid #c8c8c8;
}
.workOrder {
  padding: 20px 0 0 0 !important;
  border-right: 2px solid #c8c8c8;
  text-align: center;
  border-bottom: 2px solid #c8c8c8;
}
.workOrder p:first-child {
  font-weight: bold;
}
.workOrder p + p {
  color: #666;
  font-size: 14px;
  line-height: 45px;
  height: 45px;
}
.btngroups {
  height: 75px;
  display: flex;
  align-items: center; /*垂直居中*/
  justify-content: center; /*水平居中*/
}
.btngroups >>> .el-button {
  flex: 1;
}
.btnfang {
  text-align: center;
}
.btnfang >>> .el-button {
  border-radius: 0;
  padding: 16px 12px;
}
.pagination-area {
  padding: 10px 0;
}
.selectClass >>> .el-select {
  width: 100%;
}
.stayus0 {
  color: #fff !important;
  background: #00cc99;
}
.stayus1 {
  background: #2e75b5;
  color: #fff !important;
}
.stayus2 {
  background: #88d904;
  color: #fff !important;
}
.stayus3 {
  background: #d8d8d8;
  color: #333 !important;
}
.stayus4 {
  background: #ff0000;
  color: #fff !important;
}
.stayus5 {
  background: #ffff00;
  color: #333 !important;
}
.stayus6 {
  background: #d8d8d8;
  color: #333 !important;
}
.stayus7 {
  background: none;
  color: #333 !important;
}
.stayus8 {
  background: #9966ff;
  color: #333 !important;
}
.stayus9 {
  background: #ff9900;
  color: #333 !important;
}
.theads th {
  background: rgb(234, 235, 236);
}
.actStepColor {
  background: #000 !important;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.getColor {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  text-align: center;
  line-height: 28px;
}
.huang {
  background: #ffff80 !important;
}
.lv {
  background: #88d904 !important;
}
.tableAuto >>> .yunxing {
  background: #88d904 !important;
}
.tableAuto >>> .wancheng {
  background: #ffff80 !important;
}
.yuancheng {
  background: #88d904 !important;
}
.jiudi {
  background: #ffff00 !important;
  color: #333 !important;
}
.phaseHuang {
  background: #ffd76a !important;
}
.phaseHong {
  background: #ed1c24 !important;
}
.pinhong {
  background: #b84a5b !important;
}
.hui {
  background: #c7c2c8 !important;
}
.currTd {
  background: #8080ff !important;
}
.seqNo >>> .el-form-item__label {
  color: #fff;
}
.stepCheck >>> .el-select {
  width: 60%;
}
.borderColor {
  border-left: 2px solid #88d904 !important;
  border-right: 2px solid #88d904 !important;
}
.bottomColor {
  border-bottom: 2px solid #88d904 !important;
}
.topColor {
  border-top: 2px solid #88d904 !important;
}
.jobDescName {
  line-height: 35px;
}
@media only screen and (min-width: 1200px) {
  .workOrder.el-col-lg-4 {
    width: 15.6%;
  }
}
.operationBtn {
  display: flex;
  margin-bottom: 10px;
}
.operationBtn >>> .el-button {
  flex: 1;
}
.tableAuto1 >>> .cell {
  height: 23px;
}
</style>
